<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <title>沙盘推演</title>
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="yes" name="apple-touch-fullscreen">
    <meta name="format-detection" content="telephone=no">
    <meta http-equiv="pragma" content="no-cache"> 
	<meta http-equiv="Cache-Control" content="no-cache, must-revalidate"> 
	<meta http-equiv="expires" content="0">    
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
    <meta http-equiv="keywords" name="keywords" content="" />
    <meta http-equiv="description" name="description" content="" />
    <link href="css/ydui.css" rel="stylesheet" />
<link href="https://cdn.bootcss.com/Swiper/4.3.0/css/swiper.min.css" rel="stylesheet">
<script src="js/ydui.flexible.js"></script>
	<link rel="stylesheet" type="text/css" href="css/all.css?v=201850002"/>
	<style type="text/css">
		.iconfont{
			font-size: .5rem!important;
		}
	</style>
</head>
	<body>
		<div class="g-flexview"  id="course" v-cloak>
       		<header class="m-navbar">
	            <div class="navbar-center">
	                <span class="navbar-title">沙盘推演</span>
	            </div>
        	</header>		
			<div class="g-scrollview">
				<ul class="m-grids-3">
		            <li class="grids-item"  v-on:click="changetype(1)">
		            	<a >
							<div class="grids-icon">
			                    <i class="iconfont icon-xiangmu1"></i>
			                </div>		            	
			                <div class="grids-txt">项目基本信息</div>
		                </a>
		            </li>	
		            <li class="grids-item"  v-on:click="changetype(2)">
		            	<a >
							<div class="grids-icon">
			                    <i class="iconfont icon-tuzhi"></i>
			                </div>		            	
			                <div class="grids-txt">图纸推演</div>
		                </a>
		            </li>		            
		            <li class="grids-item"  v-on:click="changetype(3)">
		            	<a >
							<div class="grids-icon">
			                    <i class="iconfont icon-shipin1"></i>
			                </div>		            	
			                <div class="grids-txt">项目推演及教师点评视频</div>
		                </a>
		            </li>					


		        </ul>	
		        <div class="coursecontent"  v-show="type==1">
		        	<div class="noshuju" v-if="Tuistage.intro==''">
		        		
		        	</div>
		        	<div class="jiaoan"  v-if="Tuistage.intro!=''" v-html="Tuistage.intro">
		        	</div>
		        </div>		        
		        <div class="coursecontent" v-if="type==2">
					<div class="m-cell" >
			            <a class="cell-item " v-for="el in datainfo" v-on:click="fenxituzhimodel(el)">
			                <div class="cell-left">{{ComFunJS.showStatus(el)}}</div>			                
			                <label class="cell-right cell-arrow" >
			                </label>
			            </a>
			        </div>						
		        </div>		        
		        <div class="coursecontent"  v-show="type==3">
		        	<div class="noshuju" v-if="datascore.inferVideoPath==''">
		        		
		        	</div>
					<div class="m-cell" v-if="Tuistage.inferVideoPath!=''">
			            <a class="cell-item " v-bind:href="'videoplayer.html?path='+Tuistage.inferVideoPath">
			                <div class="cell-left">沙盘推演推演及教师点评视频</div>
			                <label class="cell-right cell-arrow">
			                </label>
			            </a>
			        </div>			        
		        </div>		        
			</div>		

		</div>
	</body>
    <script src="https://cdn.bootcss.com/jquery/2.2.0/jquery.min.js"></script>
	<script src="https://cdn.bootcss.com/Swiper/4.3.0/js/swiper.min.js"></script>
	<script src="js/ydui.js"></script>
    <script src="https://cdn.bootcss.com/vue/2.5.17-beta.0/vue.min.js"></script>
	<script src="js/all.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		var model= new Vue({
			el:'#course',
			data:{
				datainfo:[],
				datainfos:[],
				dataresult:{},
				datascore:{},
				projectInfotuiyan:"",
				unitId:ComFunJS.getQueryString('unitId'),
				courseId:ComFunJS.getQueryString('courseId'),
				teamId:"",
				type:"1",
	 			Tuistage:{
	 				drawingJson:[],
	 				intro:"",
	 				isInferCommitted:1,
	 				inferVideoPath:""
	 			},
	 			Roadstage:{
	 				pdfFileList:[],
	 				videoFileList:[],
	 				intro:"",
	 				roadPdfPath:"",
	 				roadVideoPath:""
	 			},
			},
			methods:{					
				fenxituzhimodel:function(sel){
					var _this= this;
					if(_this.datainfos.length>0){
						$.each(_this.datainfos, function(e,value) {
							if(value.drawingTypeId==1){
								localStorage.setItem('tuzhione',value.content)
							}
							if(value.drawingTypeId==2){
								localStorage.setItem('dianxing',value.content)
							}	
							if(value.drawingTypeId==3){
								localStorage.setItem('lantu',value.content)
							}
							if(value.drawingTypeId==4){
								localStorage.setItem('shangye',value.content)
							}
							if(value.drawingTypeId==5){						
								localStorage.setItem('yanjiang',value.content)
							}
							if(value.drawingTypeId==6){			
								localStorage.setItem('fenxi',value.content)
							}
							if(value.drawingTypeId==7){			
								localStorage.setItem('Drawnaotu',value.content)
							}									
						});						
					}					
					if(sel==1){
						window.location.href='tuzhi/tuzhione.html?'+'use=0'+'&'+'teamId='+this.teamId;				
					}
					if(sel==2){
						window.location.href='tuzhi/dianxing.html?'+'use=0'+'&'+'teamId='+this.teamId;					
					}
					if(sel==3){
						window.location.href='tuzhi/lantu.html?'+'use=0'+'&'+'teamId='+this.teamId;						
					}
					if(sel==4){
						window.location.href='tuzhi/shangye.html?'+'use=0'+'&'+'teamId='+this.teamId;					
					}
					if(sel==5){						
						window.location.href='tuzhi/yanjiang.html?'+'use=0'+'&'+'teamId='+this.teamId;					
					}
					if(sel==6){			
						window.location.href='tuzhi/fenxi.html?'+'use=0'+'&'+'teamId='+this.teamId;				
					}
					if(sel==7){			
						window.location.href='../mobilenaotu/index.html?'+'teamId='+this.teamId;					
					}								
				},		
	            initWebSocket(teamId){ //初始化weosocket
	                //ws地址
	                const wsuri = ComFunJS.WEBSORCTAPIURL("/webSocketServer/"+this.teamId) ;
	                this.websock = new WebSocket(wsuri);
	                if(!this.isInferCommitted){
	             	   this.websock.onmessage = this.websocketonmessage;
	                }
	            },
	            websocketonmessage(e){ //数据接收
	            	var _this=this;
	            	if(e!=undefined){
	            		var redata =JSON.parse(e.data);
						if(model.Tuistage.intro!=redata.info){
							model.Tuistage.intro=redata.info;
						}
	            	}

	            },
	            websocketclose(e){  //关闭
	                console.log("connection closed (" + e.code + ")");
	            },						
				getinfo:function(){
					var _this =this
					ComFunJS.getJSON(ComFunJS.APIURL('/course/student/'),{courseId:_this.courseId,userId:ComFunJS.getCookie('userId')},function(res){
						_this.teamId=res.list[0].teamId;
						_this.initWebSocket()
						if(!res.error){
				    		ComFunJS.getJSON(ComFunJS.APIURL('/course/team/'+_this.teamId),function(result){
							_this.Tuistage.intro=result.inferIntro;
							_this.Tuistage.inferVideoPath=result.inferVideoPath;
							_this.Roadstage.intro=result.roadIntro;
							_this.Roadstage.roadPdfPath=result.roadPdfPath;		
							_this.Roadstage.roadVideoPath=result.roadVideoPath;									
							_this.isInferCommitted=result.isInferCommitted;
							_this.isRoadCommitted=result.isRoadCommitted;
							_this.datainfos=result.teamDrawingCommits;
				    		})
						}else{
							window.location.href='login.html'
						}
					})
				},				
				changetype:function(type){
					this.type=type;
				},
				getdatainfo:function(){		
					var _this=this;
					ComFunJS.getJSON(ComFunJS.APIURL('/course/'+this.courseId),function(r){
						if(!r.error){		
							r.courseStages[2].drawingTypeIds=r.courseStages[2].drawingTypeIds.split(',')
							_this.datainfo=r.courseStages[2].drawingTypeIds
						}
					})	

				},
				
			},
			mounted:function(){
				this.$nextTick(function(){
					localStorage.setItem('tuzhione','')
					localStorage.setItem('dianxing','')
					localStorage.setItem('lantu','')
					localStorage.setItem('shangye','')
					localStorage.setItem('yanjiang','')
					localStorage.setItem('fenxi','')
					localStorage.setItem('Drawnaotu','')
					this.getdatainfo();
					this.getinfo()
				
				})
			}
		})
	</script>
</html>
